<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>第一个JS特效(显示、隐藏)</title>
	<style type="text/css">
        #div1{
        	width:300px;height:200px;background: #ccc;border:1px solid #999;display:none;
        }

	</style>
</head>


<body>
    <!-- <input type="checkbox" onmouseover="div1.style.display='block';"  onmouseout="div1.style.display='none';"> -->


    <!-- 为了考虑浏览器兼容性，不能直接写id,用document.getElementById()获取元素 -->
    <input type="checkbox" onmouseover="document.getElementById('div1').style.display='block';"
     onmouseout="document.getElementById('div1').style.display='none';">
    <div id="div1">
    	为了您的财产安全,请。。。。。。。
    </div>
	
</body>
</html>